
//压力折线
var pressureChart;
//温度折线
var templatureChart;

///更新曲线
var chartInterval;
var mainPressureData = [];
var remotePressureData = [];
function updateChart() {
    chartInterval = setInterval(() => {
        var time = moment().format("YYYY-MM-DD HH:mm:ss");
        var mainPressureItem = [time, mainPressure];
        mainPressureData.push(mainPressureItem);
        var remotePressureItem = [time, remotePressure];
        remotePressureData.push(remotePressureItem);
        var pressureChartOption = {
            series: [
                {
                    name: '近端压力',
                    data: mainPressureData
                },
                {
                    name: '远端压力',
                    data: remotePressureData
                }
            ]
        }
        pressureChart.setOption(pressureChartOption);
    }, 1000);
}

$(document).ready(function () {
    setupLineChart();
});

//折线图
function setupLineChart() {
    setupPressureChart()
    setupTemplatureChart()
}

//配置压力折线
function setupPressureChart() {
    var pressureLineChartOption = lineChartOption();
    pressureLineChartOption.title = { text: "压力曲线", textStyle: { color: "#ffffff" } }
    pressureLineChartOption.legend = {
        data: [
            legendOption('近端压力'),
            legendOption('远端压力'),
        ]
    }
    pressureLineChartOption.series = [
        seriesOption('近端压力', "#ffb800"),
        seriesOption('远端压力', "#ff5722"),
    ]
    pressureChart = echarts.init(document.getElementById('pressure'));
    pressureChart.setOption(pressureLineChartOption);
    pressureChart.resize();
}

//配置温度折线
function setupTemplatureChart() {
    var templatureLineChartOption = lineChartOption();
    templatureLineChartOption.title = { text: "温度曲线", textStyle: { color: "#ffffff" } }
    templatureLineChartOption.legend = {
        data: [
            legendOption('近端介质温度'),
            legendOption('远端介质温度'),
            legendOption('环境温度')
        ]
    }
    templatureLineChartOption.series = [
        seriesOption('近端介质温度', '#FF1493'),
        seriesOption('远端介质温度', "#ed1941"),
        seriesOption('环境温度', "#00ae9d")
    ]
    templatureChart = echarts.init(document.getElementById('templature'));
    templatureChart.setOption(templatureLineChartOption);
}

//每条折线样式配置
function seriesOption(name, color) {
    var opt = {
        name: name,
        type: 'line',
        smooth: true,
        showSymbol: false,
        color: color
    };
    return opt
}

//图例样式配置
function legendOption(name) {
    var opt = {
        name: name,
        textStyle: { color: "#ffffff" }
    };
    return opt
}
function lineChartOption() {
    var now = moment(moment().format("YYYY-MM-DD HH:mm") + ":00");
    var startDate = now.format("YYYY-MM-DD HH:mm:ss");
    var endDate = now.add(28, 'm').format("YYYY-MM-DD HH:mm:ss");
    var xAxis = xAxisOption(startDate);
    xAxis["max"] = endDate;
    var option = {
        tooltip: {
            trigger: "axis",
        },
        dataZoom: [{
            type: 'slider',
            realtime: true,
        }],
        xAxis: xAxis,
        yAxis: {
            min: 0,
            max: function (value) {
                Math.ceil(value.max + (value.max - value.min) * 0.2);
            },
            axisLabel: {
                color: "#ffffff"
            }
        }
    };
    return option;
}

function xAxisOption(startDate) {
    var data = {
        type: 'time',
        name: '时间',
        min: startDate,
        axisLabel: {
            formatter: '{MM}-{dd} {HH}:{mm}:{ss}',
            show: true,
            showMinLabel: true,
            showMaxLabel: true,
            width: 60,
            overflow: 'break',
            color: "#ffffff"
        }
    };
    return data;
}